<template>
	<view class="body">
		<xk-header title="防疫入园资料填写"></xk-header>
		<view class="util-bar">
			<view class="estate-box">
			<u--form
			labelPosition="left"
			:model="formdata"
			:rules="rules"
			ref="uviewForm"
			>
				<u-form-item
					label="公司名称:"
					:required = "true"
					prop="company"
					borderBottom
					ref="company"
					labelWidth="120"
				>
				<u--input v-model="formdata.company" placeholder="请输入公司名称" border="none"></u--input>
				</u-form-item>
				<u-form-item
					label="联系电话:"
					:required = "true"
					prop="phone"
					borderBottom
					ref="phone"
					labelWidth="120"
				>
				<u--input v-model="formdata.phone" placeholder="请输入联系电话" border="none"></u--input>
				</u-form-item>
				<u-form-item
					label="车牌号:"
					prop="plate_number"
					borderBottom
					ref="plate_number"
					labelWidth="120"
				>
				<u--input v-model="formdata.plate_number" placeholder="请输入车牌号" border="none"></u--input>
				</u-form-item>

				<u-form-item
					label="出发地:"
					:required = "true"
					prop="start_address"
					borderBottom
					ref="start_address"
					labelWidth="120"
				>
				<u--input v-model="formdata.start_address" placeholder="请输入出发地" border="none"></u--input>
				</u-form-item>

				<u-form-item
					label="交通方式:"
					:required = "true"
					prop="traffic_manner"
					borderBottom
					ref="traffic_manner"
					labelWidth="120"
				>
				<u--input v-model="formdata.traffic_manner" placeholder="请输入交通方式" border="none"></u--input>
				</u-form-item>

				<u-form-item
					label="申请入园日期:"
					:required = "true"
					prop="apply_end_time"
					borderBottom
					ref="apply_end_time"
					labelWidth="120"
				>
				<u-calendar :show="date" @confirm="choseDate" @close="afterChoseDate"></u-calendar>
				<view :class="applyParkDate?'':'grey-t'" @click="date = true">{{applyParkDate?applyParkDate : '请输入入园日期'}}</view>
				</u-form-item>

				<u-form-item
					label="有无来往高风险地区:"
					:required = "true"
					prop="highrisk"
					borderBottom
					ref="highrisk"
					labelWidth="160"
					style="flex-direction: row !important;"
				>
				<view style="display:flex;">
				<u-switch v-model="highrisk" @change="chose" size="25"></u-switch><view style="margin-left: 6px;line-height: 25px;">{{highrisk?"有":"无"}}</view></view>
				</u-form-item>

				<u-form-item
					label="提交健康码:"
					:required = "true"
					prop="jkcode"
					borderBottom
					ref="jkcode"
					labelWidth="105"
				>
					<u-upload
							:fileList="fileList1"
							@afterRead="afterRead"
							@delete="deletePic"
							name="1"
							multiple
							:maxCount="10"
							width="60"
							height="60"
						></u-upload>
				</u-form-item>

				<u-form-item
					label="提交行程码:"
					:required = "true"
					prop="xccode"
					borderBottom
					ref="xccode"
					labelWidth="105"
				>
					<u-upload
							:fileList="fileList2"
							@afterRead="afterRead"
							@delete="deletePic"
							name="2"
							multiple
							:maxCount="10"
							width="60"
							height="60"
						></u-upload>
				</u-form-item>

				<u-form-item
					label="入园事由:"
					:required = "true"
					prop="park_reason"
					borderBottom
					ref="park_reason"
					labelWidth="120"
				>

				</u-form-item>
				<u--textarea v-model="formdata.park_reason" placeholder="请输入入园事由" height="50" count confirmType="done"></u--textarea>

				<u-form-item
					label="备注:"
					prop="remark"
					borderBottom
					ref="remark"
					labelWidth="120"
				>

				</u-form-item>
				<u--textarea v-model="formdata.remark" placeholder="请输入备注信息" height="50" count confirmType="done"></u--textarea>
			</u--form>
			</view>
		</view>
		<view class="common-bottom-view" v-if="formdata.park_status != 10 || formdata.park_status != 20">
			<view class="common-btn btn" @click="subimtApply">提交申请</view>
		</view>
		<view class="common-bottom-view" v-if="formdata.park_status == 10 || formdata.park_status == 20">
			<view class="common-btn btn" @click="applyUpdate">修改并提交</view>
		</view>
		<view style="height:100px;"></view>
	</view>
</template>

<script>
	import config from '@/common/config.js'
	
	export default {
		data() {
			return {
				fileNames:[],
				applyParkDate:'',
				date:false,
				fileList1:[],
				fileList2:[],
				highrisk:false,
				Tshow:false,
				apply_end_time:Number(new Date()),
				formdata:{
					park_id:'',
					company:'',
					phone:'',
					plate_number:'',
					start_address:'',
					traffic_manner:'',
					apply_park_date:'',
					remark:'',
					highrisk:0,
					isSubmit:true,
					jkcode:'',
					xccode:'',
					park_reason:'',
				},
				notNull: {
					apply_park_date:"请选择入园日期",
					jkcode:"请上传健康码",
					xccode:"请上传行程码",
					park_reason:"请填写入园事由",
				},
				rules: {
					'company': {
						type: 'string',
						required:true,
						message: '请填写公司名称',
						trigger:['blur','change']
					},
					'phone': {
						type: 'string',
						required:true,
						message: '请填写联系电话',
						trigger:['blur','change']
					},
					
					// 'plate_number': {
					// 	type: 'string',
					// 	required:true,
					// 	message: '请填写车牌号码',
					// 	trigger:['blur','change']
					// },
					'start_address': {
						type: 'string',
						required:true,
						message: '请填写出发地',
						trigger:['blur','change']
					},
					'traffic_manner': {
						type: 'string',
						required:true,
						message: '交通工具',
						trigger:['blur','change']
					}
				},
			}
		},
		onShow(){
			console.log("onShow")
			
		},
		onLoad(options) {
			console.log("onLoad")
			if(options.parkId){
				this.parkId = options.parkId
				console.log("修改or申请：",this.parkId)
				if(options.highrisk == 0 || options.highrisk == 1){
					this.highrisk = options.highrisk
				}
				console.log("是否去过风险地区：",this.highrisk)
			}
			if(this.parkId){
				this.getMessage()
			}
		},
		methods: {

			//选择入园日期
			choseDate(e){
				console.log(e)
				this.applyParkDate = e[0]
				// console.log("入园日期：",this.applyParkDate)
				this.date = false
				this.formdata.apply_park_date = this.applyParkDate
				console.log("入园日期：",this.formdata.apply_park_date)
			},
			afterChoseDate(){
				this.date = false
			},

			//有无来往高风险地区
			chose(e){
				console.log("highrisk: ",this.highrisk)
				console.log("有无来往高风险地区：",e)
				if(this.highrisk == true){
					this.formdata.highrisk = 1
				}else if(this.highrisk == false){
					this.formdata.highrisk = 0
				}
				console.log(this.formdata.highrisk)
			},
			
			//修改信息前初始化按钮状态
			modify(){
			
				//初始化按钮状态
				if(this.formdata.highrisk == 1){
					this.highrisk = true
				}else if(this.formdata.highrisk == 0){
					this.highrisk = false
				}
			},
			
			//获取要修改的数据
			getMessage(){
				this.$api.prevention_park_detail(this.parkId).then((res) => {
					this.formdata = res.poPreventionPark_getPreventionPark
					console.log("要修改的防疫信息：",this.formdata)
					this.formdata.jkcode = ''
					this.formdata.xccode = ''
					this.applyParkDate = this.formdata.apply_park_date
					this.modify()
				})
			},

			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
				var arr = []
				var delet = []
				if(event.name == 1){
					arr = this.formdata.jkcode.split(';')
					console.log("图片数组：",arr)
					delet = arr.splice(event.index, 1)
					this.formdata.jkcode = arr.join(";")
					console.log("删除的图片：",delet)
					console.log("图片列表：",this.formdata.jkcode)
				}else if(event.name == 2){
					arr = this.formdata.xccode.split(';')
					delet = arr.splice(event.index, 1)
					this.formdata.xccode = arr.join(";")
					console.log("删除的图片：",delet)
					console.log("图片列表：",this.formdata.xccode)
				}
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = this.uploadFilePromise(lists[i].url)
					console.log("modifyData健康码数组2：",this.formdata.jkcode)
					if(event.name == 1){
						this.uploadFilePromise(lists[i].url).then((res) => {
							console.log("传过来的数据:",res.result)
							this.formdata.jkcode += res.result + ";"
							console.log("modifyData健康码数组：",this.formdata.jkcode)
							console.log("modifyData行程码码数组2：",this.formdata.xccode)
						})
					}else if(event.name == 2){
						this.uploadFilePromise(lists[i].url).then((res) => {
							console.log("传过来的数据:",res.result)
							this.formdata.xccode += res.result + ";"
							console.log("modifyData行程码码数组：",this.formdata.xccode)
							console.log("modifyData健康码数组3：",this.formdata.jkcode)
						})
					}

					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			
			//上传图片
			uploadFilePromise(urlTemp){
					return new Promise((resolve, reject) => {
					console.log("kkkk",this.$util.getStorage("loginInfo"))
					let loginInfo = this.$util.getStorage("loginInfo")
					let url = config.BASE_URL + "app/mySelf/uploadPicfile?token=" + loginInfo.token
					console.warn("url: ", url)
					let header = {}
					// #ifndef H5
					header= {"Content-Type": "multipart/form-data"};
					// #endif
					console.log("modifyData健康码数组A：",this.formdata.jkcode)
					let a = uni.uploadFile({
						url: url, // 后端api接口
						filePath: urlTemp, // uni.chooseImage函数调用后获取的本地文件路劲
						name: 'file', //后端通过'file'获取上传的文件对象
						// formData: {
						// 	user: 'test'
						// },
						header: header,
						success: (res) => {
							console.log("路径：",urlTemp)
							console.log("modifyData健康码数组B：",this.formdata.jkcode)
							// setTimeout(() => {
							// 	resolve(res.data.data)
							// }, 1000)
							if (res.data){
								res = JSON.parse(res.data);
								if (res.result) {
									this.fileNames.push(res.result)
									console.log("res:",res)
									// imageUrls.concat([formatImgPath(res.result+";")])
								}
							}
							resolve(res);
						}
					});
				})
			},
			
			//提交入园申请
			subimtApply(){
				console.log("初步结果：",this.formdata)
				for (let item in this.notNull) {
					console.log("循环：",this.formdata)
					if (!this.formdata[item]) {
						this.$util.toast(this.notNull[item]);
						return;
					}
				}
				console.log("highrisk: ",this.formdata.highrisk)
				this.$util.confirm({
					content: "确定提交防疫入园申请？",
					confirmText: "确定"
				}).then(isConfirm => {
					if (isConfirm) {
						console.log("结果：",this.formdata)
						this.$util.post({
							url: "poPreventionPack/apply",
							data: this.formdata,
						}).then(res => {
							uni.redirectTo({
								url: '/pagesA/prevention-park/prevention-park-finish?type=accept'
							})
						})

					}
				})

			},

			//修改数据
			applyUpdate(){
				this.formdata.isSubmit = false
				console.log("修改前前结果：",this.formdata)
				this.$util.confirm({
					content: "确定修改防疫入园申请？",
					confirmText: "确定"
				}).then(isConfirm => {
					if (isConfirm) {
						console.log("结果：",this.formdata)
						this.$util.post({
							url: "app/poPreventionPack/applyUpdate",
							data: this.formdata,
						}).then(res => {
							uni.redirectTo({
								url: '/pagesA/prevention-park/prevention-park-finish?type=accept'
							})
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.body{
	background:#F8F8F8;
}
.estate-box{
	background:#FFFFFF;
	padding:10px 10px 30px 10px;
	margin:10px;
	border-radius:6px;
}
.grey-t{
	color:#CCCCCC;
}
.loadText{
	padding:5px 0px 20px 0px;
}
</style>
